<template>
  <div class='new-product'>
    <ProductHead @doDel="doDel" @doUp="doUp" @doDown="doDown" @doEdit="doEdit" @doSave="doSave" />
    <main>
      <p class="title">基础信息</p>
      <ListModel @chooseT="chooseT" key="lsitmodel_1" :modelData="modelData0" :data="detailData.product" :readonly="readonly" />
      <p class="title">商品信息</p>
      <ListModel key="lsitmodel_2" :modelData="modelData1" :data="detailData.product" :readonly="readonly" />
      <p class="title mt20">商品型号 <span class="iconfont icon-jia color-blue ft18 hover " @click="addVersion('3')" v-if="!readonly"><span class="ft12 color-999 ml5 add">新增</span></span></p>
      <Version key="version_1" :modelData="modelData3" :listData="detailData.pModelList" :readonly="readonly" />
      <p class="title mt20">商品介绍</p>
      <Editor :readonly="readonly" :info="detailData.product.detail" @getDetail="setDetail"/>
      <p class="title mt20">商品参数 <span class="iconfont icon-jia color-blue ft18 hover " @click="addVersion('4')" v-if="!readonly"><span class="ft12 color-999 ml5 add">新增</span></span></p>
      <Version key="version_2" :modelData="modelData4" :listData="detailData.ppList" :readonly="readonly" />
    </main>

    <AddModel v-if="$store.state.dias.product.show" @editData0="reflashData" @editData1="reflashData1" />
  </div>
</template>
<script>
import ProductHead from '../../../buyer/specify/detail/head.vue'
import ListModel from './listmodel.vue'
import Version from './version.vue'
import Editor from '@/components/wangEditor.vue'
import AddModel from './dias/add'
import MixinsDetail from '@/mix/mixDetail.js'
import {categoryObj} from '@/assets/js/commonArray.js'
export default {
  components: {ProductHead,ListModel,Version,Editor,AddModel},
  name: "",
  data() {
    return {
      readonly:false,
      modelData0:[
        // {prop:"id",label:"商品id"},
        // {prop:"productCode",label:"编号"},
        {prop:"categoryId",label:"分类",isSelect:true,array:categoryObj},
        {prop:"topName",label:"品名",isSelect:true,value:[],array:[]},
        {prop:"name",label:"商品名称",isInput:true},
        {prop:"materials",label:"材质",isSelect:true,value:[],array:[]},
        {prop:"features",label:"特性",isSelect:true,value:[],array:[]},
        //{prop:"taxPoint",label:"税点",isInput:true},
        // {prop:"",label:"运费",isRadio:true,value:"1",array:[{label:"有运费",value:"1"},{label:"免运费",value:"2"}],change:"setFee"},
        {prop:"freight",label:"运费",isInput:true},
      ],
      modelData1:[
        {prop:"subImages",label:"商品图片",isUpload:true,path:PATH+"Common/getPicAddress.do"},
        {prop:"subtitle",label:"商品介绍",isTextarea:true}
      ],

      modelData3:[ //型号
        {prop:"model",label:"型号"},
        {prop:"color",label:"颜色"},
        {prop:"price",label:"价格"},
        {prop:"",label:"操作",width:"50",isbtn:true,btns:[{label:"删除",class:"color-red",click:this.doDel3},{label:"修改",class:"color-blue",click:this.doEdit3,index:3}]},
      ],
      modelData4:[ //参数
        {prop:"name",label:"参数名称",width:"30",},
        {prop:"info",label:"参数详情"},
        {label:"操作",width:"30",isbtn:true,btns:[{label:"删除",class:"color-red",click:this.doDel4},{label:"修改",class:"color-blue",click:this.doEdit3,index:4}]},
      ],

      detailData:{
        product:{},
        pModelList:[],
        ppList:[]
      },
    };
  },
  methods: {
    doChange(item){
      if(item.change)this[item.change](item)
    },

      /**
       * 获取分类的结果，给材质和特性写入数据
       */
    chooseT(val){
        console.log(this.detailData.product,"ccccccccccccc")
        this.$set(this.modelData0[1],"array",val.data.data.topName.map(val=>{return{label:val.name,value:val.id}}))
        this.$set(this.modelData0[3],"array",val.data.data.materials.map(val=>{return{label:val.name,value:val.id}}))
        this.$set(this.modelData0[4],"array",val.data.data.spec.map(val=>{return{label:val.name,value:val.id}}))
      },

    /**
     * @name 调整运费
     */
    setFee(item){
      this.modelData0.length===7?this.modelData0.push({prop:"",label:"运费",isInput:true}):this.modelData0.pop()
    },

    doDel(){
      _g.apiPost('goodsManage/delete.do',{ids:this.id}).then(res=>{
        _g.toMessage(res)
        if(res.status==0){
          setTimeout(()=>{
            this.$router.go(-1)
          },1200)
        }
      })
    },
    doUp(){
      _g.apiPost('goodsManage/grounding.do',{ids:this.id}).then(res=>{
        _g.toMessage(res)
        if(res.status==0){
          setTimeout(()=>{
            this.$router.go(-1)
          },1200)
        }
      })
    },
    doDown(){
      _g.apiPost('goodsManage/undercarriage.do',{ids:this.id}).then(res=>{
        _g.toMessage(res)
        if(res.status==0){
          setTimeout(()=>{
            this.$router.go(-1)
          },1200)
        }
      })
    },
    doEdit(){
      this.readonly=false
      this.modelData0.splice(7,0,{prop:"",label:"运费",isRadio:true,value:"1",array:[{label:"有运费",value:"1"},{label:"免运费",value:"2"}],change:"setFee"})
    },
    doSave(){
        console.log(this.detailData,"提交总参数")
        //整理各种下拉框
       /* {prop:"topName",label:"品名",isSelect:true,value:[],array:[]},
        {prop:"name",label:"商品名称",isInput:true},
        {prop:"materials",label:"材质",isSelect:true,value:[],array:[]},
        {prop:"features",label:"特性",isSelect:true,value:[],array:[]},
*/
        let topNames = this.detailData.product.topName.split(",")
        let names = this.detailData.product.name.split(",")
        let materialss = this.detailData.product.materials.split(",")
        let featuress = this.detailData.product.features.split(",")

        this.$set(this.detailData.product,"topName",topNames[0])
        this.$set(this.detailData.product,"name",names[0])
        this.$set(this.detailData.product,"materials",materialss[0])
        this.$set(this.detailData.product,"features",featuress[0])
        this.$set(this.detailData.product,"topNameId",topNames[1])
        this.$set(this.detailData.product,"nameId",names[1])
        this.$set(this.detailData.product,"materialsId",materialss[1])
        this.$set(this.detailData.product,"featuresId",featuress[1])

        //整理图片格式
        let imgs = ""
        this.detailData.product.subImages.forEach(ele=>{
            imgs+= ele+";"
        })
        this.$set(this.detailData.product,"subImages",imgs)
        //整理型号格式
        let pModel = []
        this.detailData.pModelList.forEach(ele=>{
            ele.children.forEach(elem=>{
                //elem.push({model:ele.model})
                this.$set(elem,"model",ele.model)
                pModel.push(elem)
            })
        })
        this.$set(this.detailData.product,"productModel",JSON.stringify(pModel))
        //整理参数格式
        this.$set(this.detailData.product,"productParameter",JSON.stringify(this.detailData.ppList))
        let params =this.detailData.product
        _g.apiPost("goodsManage/insertProduct.do",params).then(res=>{
            if(res.status == 0){
                _g.toMessage(res.data)
            }else{
                _g.toMessage(res)
            }
        })
      this.readonly=true
      this.modelData0.splice(7,1)
      
      // editor 内容
      let editorC = this.$store.state.editors.product.obj.txt.html()
      
    },

    doDel3(scope){
     /* let indexArray=scope.row.index0.split("_")
      if(indexArray.includes("-1")){
        this.info.data3.splice(indexArray[0],1)
      }else if(this.info.data3[indexArray[0]].children.length>1){
        this.info.data3[indexArray[0]].children.splice(indexArray[1],1)
      }else{
        this.info.data3.splice(indexArray[0],1)
      }*/
        let indexArray=scope.row.index0.split("_")
        if(indexArray.includes("-1")){
            this.detailData.pModelList.splice(indexArray[0],1)
        }else if(this.detailData.pModelList[indexArray[0]].children.length>1){
            this.detailData.pModelList[indexArray[0]].children.splice(indexArray[1],1)
        }else{
            this.detailData.pModelList.splice(indexArray[0],1)
        }
    },
    doDel4(scope){
      let indexArray=scope.row.index0.split("_")
      this.detailData.ppList.splice(indexArray[0],1)
    },

    /**
     * @name 新增型号或者参数
     */
    addVersion(index){
      this.$store.state.dias.product.title="添加商品"+(index==3?'型号':'参数'),
      this.$store.state.dias.product.isversion=index==3
      this.$store.state.dias.product.show=true
    },

    doEdit3(scope,btn){
      this.$store.state.dias.product.title='修改商品'+(btn.index==3?"型号":"参数")
      this.$store.state.dias.product.isversion=btn.index==3
      this.$store.state.dias.product.content=scope.row
      this.$store.state.dias.product.show=true
    },

    /**
     * @name 编辑型号
     */
    reflashData(val){
      if(!val.index0){
       // this.info.data3.push(val)
        //显示参数
        this.detailData.pModelList.push(val)
      }else{
        let indexArray=val.index0.split("_")
        this.$set(this.detailData.pModelList,indexArray[0],val)
        //this.$set(this.info.data3,indexArray[0],val)
      }
    },
    reflashData1(val){
      if(!val.index0){
        this.detailData.ppList.push(val)
        //this.info.data4.push(val)
      }else{
        let indexArray=val.index0.split("_")
        this.$set(this.detailData.ppList,indexArray[0],val)
      }
    },
      setDetail(res){
        this.$set(this.detailData.product,"detail",res)
      },

    init(id,categoryId){
      this.readonly=_g.getRouterPath(this)=="/center/seller/product/productList/detail"

        let params = {
            id:id,
            categoryId:categoryId
        }
        _g.apiPost("goodsManage/selectProductInfo.do",params).then(res=>{
            if(res.status == 0){

                this.$set(this.detailData,"product",res.data.product)
                this.$set(this.detailData,"pModelList",res.data.pModelList)
                this.$set(this.detailData,"ppList",res.data.ppList)

            }else{
                _g.toMessage(res)
            }
        })
      //if(!this.readonly)this.modelData0.shift()
      //   this.modelData0.shift()
   /*   if(false){//编辑
          this.getDetail()
      }else{//新增*/
          // this.modelData0.shift()
          /* if(this._data.categoryId && this._data.categoryId != 0){
               _g.apiPost("goodsManage/insertPage.do").then(res=>{
                   console.log(res)
               })
           }else{
               // alert("请先选择分类")
           }
      }*/
    }
  },
  created() {
    this.$nextTick(()=>{
        let id = this.$router.history.current.query.id
        let categoryId = this.$router.history.current.query.categoryId
        if(id!=null){
            this.init(id,categoryId)
        }

    })
  },
  mixins:[MixinsDetail]
};
</script>
<style lang="scss" scoped>
.new-product {

  main{
    padding: 20px 35px 60px 35px;
    
    .title{
      border-left: 2px solid $blue;
      text-indent: 15px;
      line-height: 35px;
      margin-bottom: 5px;

      .iconfont{
        margin-left: 565px;
      }
      .add{
        position: relative;
        top: -2px;
      }
    }
  }
}
</style>